/* HACK FIREFOX 4.0 ADDONS MANAGER TO LOOK LIKE FIREFOX 3.x
by Patrick J. Dempsey */

/* import DETAILS style */
@import url(chrome://mozapps/skin/extensions/amostyleaom.css);


/************* rearrange everything ***********/

/* load the binding that makes categories horizontal */
#addons-page #categories > scrollbox > .scrollbox-innerbox {
  -moz-binding: url("chrome://global/skin/globalBindings.xml#addons-richlistbox"); }

/* puts categories on top of addons */
#addons-page > #header + hbox { -moz-box-orient: vertical !important; }

/* places category labels under icons */
#addons-page .category {-moz-box-orient: vertical !important; }

/* general margin and padding cleanup */
#addons-page #header,
#view-container .list,
#categories { margin: 0; padding: 0;}

/* rearrange the z-index of elements so buttons still work */
#addons-page #header + hbox {
position: relative !important; z-index: 5 !important;}
#addons-page #header {
position: relative !important; z-index: 10 !important;}

/* rearrange the order of items in the header */
#header #back-btn { -moz-box-ordinal-group: 1 !important;}
#header #forward-btn { -moz-box-ordinal-group: 2 !important;}
#header #header-search { -moz-box-ordinal-group: 3 !important;}
#header #header-searching { -moz-box-ordinal-group: 4 !important;}
#header #updates-container { -moz-box-ordinal-group: 5 !important;}
#header spacer { -moz-box-ordinal-group: 6 !important;}
#header #header-utils-btn { -moz-box-ordinal-group: 7 !important;}

 
/*********************  CATEGORIES ******************/
                   
/* View buttons */
#addons-page #categories > scrollbox > .scrollbox-innerbox {
  border: none;
  margin: 0px;
  -moz-padding-start: 10px;
  color: white;
  background: highlight url("chrome://browser/skin/preferences/background.png")  repeat-x center;
    border-bottom: 1px solid rgba(0,0,0,.4);
}

.category {
  border: none;
  -moz-appearance: none;
  -moz-box-align: center;
  overflow: hidden;
  min-height: 55px;
}

.category-name { font-size: 120%; }

#addons-page .category-icon {
  list-style-image: url("chrome://mozapps/skin/extensions/viewButtons.png");
}

#addons-page .category:not([selected="true"]):hover {
  background-image: none;
  background: highlight url("chrome://browser/skin/preferences/hover.png") repeat-x center !important;
  color: white;
}

#addons-page .category[selected="true"] {
  background-image: none;
  background: highlight url("chrome://browser/skin/preferences/selected.png") repeat-x center !important;
  color: black;
}

.category-icon {
  width: 32px;
  height: 32px;
}

#category-extensions > .category-icon {
  -moz-image-region: rect(0px, 32px,  32px, 0px)
}

#category-themes > .category-icon {
  -moz-image-region: rect(0px, 64px,  32px, 32px)
}

#category-languages > .category-icon {
  -moz-image-region: rect(0px, 96px,  32px, 64px)
}

#category-searchengines > .category-icon,
#category-plugins > .category-icon {
  -moz-image-region: rect(0px, 128px, 32px, 96px)
}

#category-availableUpdates > .category-icon {
  -moz-image-region: rect(0px, 160px, 32px, 128px)
}

#category-recentUpdates > .category-icon {
  -moz-image-region: rect(0px, 192px, 32px, 160px)
}

#category-discover > .category-icon {
  -moz-image-region: rect(0px, 224px, 32px, 192px)
}

#category-search > .category-icon {
  -moz-image-region: rect(0px, 256px, 32px, 225px)
}

/* sets category width and height */
#addons-page .category:not([disabled]) {
min-width: 7.5em;
width: 100%;
height: 55px;
padding: 5px;
opacity: 1;}

/* hides disabled categories */
#addons-page .category[disabled] {
min-width: 0px;
width: 0px;
height: 0px;
padding: 0px;
opacity: 0;}

/* I have no idea what these are so I suppress them*/
.category-badge[value="0"] { visibility: hidden; }


/*********************** HEADER ****************************/

/* Move HEADER below CATEGORIES */
/* categories 55px + header 35px + header border 1px = 91px - 40px = 51px */
#addons-page #header {
margin-top: 51px;
margin-bottom: -91px;}

#addons-page #header {
-moz-appearance: none!important;
height: 35px;
padding: 2px;
color: -moz-DialogText;
font: message-box;
border-top: none;
border-bottom: 1px solid rgba(0,0,0,.4);
background: -moz-dialog url("chrome://browser/skin/toolbox-fade.png") repeat-x top;
-moz-box-shadow: inset 0 1px 2px rgba(255,255,255,.8),
inset 0 .5em .5em rgba(255,255,255,.6);
}

/* move everything else down to make room for the HEADER */
#view-port { margin-top: 35px; }


/***********  SEARCH/UPDATES PANEL ***************/

/* move search-filters down below HEADER */
#addons-page  #search-filter {
height: 20px;
margin-bottom: 0px;
border-bottom: 1px solid rgba(0,0,0,.4);
-moz-box-shadow: inset 0pt 0.5em 0.5em rgba(0, 0, 0, 0.05);
}

/* hide search list if no search results found */
#updates-list-empty:not([hidden="true"]) ~ #updates-list,
#search-list-empty:not([hidden="true"]) ~ #search-list { visibility: hidden; }

/* hide useless button in empty search results */
#updates-list-empty .addon-control,
#search-list-empty .addon-control { visibility: hidden; }

/* center label in empty search results */
#updates-list-empty label,
#search-list-empty label {
text-align: center;
font-size: 150%;}


/************* header icons ***************/

#addons-page #header-utils-btn {
  min-width: 4.5em;
  list-style-image: url("chrome://mozapps/skin/extensions/utilities.png");
  padding: 5px;
  padding-top: 0px;
  padding-bottom: 0px; }
 
/* corrects a bug caused by theme rules elsewhere */
#addons-page .button-menu-dropmarker {
background: transparent none !important; }

#back-btn {
-moz-border-radius: 50%;
padding: 2px;
min-width: 26px !important; width: 26px !important;
height: 26px !important;
list-style-image: url("chrome://mozapps/skin/extensions/go-back.png");
}
#back-btn:-moz-locale-dir(rtl) { -moz-transform: scaleX(-1);}

/* I don't like the forward button, so I always hide it */
#addons-page #forward-btn { display: none; }

#header-searching { list-style-image: url("chrome://global/skin/icons/loading_16.png"); }

/* height of search bar */
#header-search { height: 22px; }


/****************** SORTERS ******************/

/* remove the sort controls, because I think they are useless
if you want to add them back they need to be rearranged to fit */
.sort-controls {  display: none; }


/****************** WARNINGS ****************/

/* wide warnings in panels that they don't matter */
#detail-view .global-warning-container,
#search-view .global-warning-container { display: none!important;}

/* move WARNINGS down below HEADER */
#addons-page[warning] .global-warning-container {
height: 20px !important;
margin-bottom: 0px !important;
border-bottom: 1px solid rgba(0,0,0,.4);
background: rgb(250,190,26) url("chrome://browser/skin/toolbox-fade.png") repeat-x top;
}

#addons-page[warning] .global-warning {
margin: 0 ;
background: transparent  none;
color: black;
position: relative !important;
z-index: 4 !important;
}

/* hide warning spacer */
.global-warning + spacer {display:none !important;}

/* centers the warning */
#addons-page[warning] .global-warning-container {
-moz-box-orient: vertical !important;}

.global-warning .button-link { color:-moz-nativehyperlinktext; padding: 0px;}

.warning-icon {
  opacity: 0.7;
  list-style-image: url("chrome://global/skin/icons/warning-16.png");
  height: 16px;
  width: 16px;
  margin: 2px;
}


/******************** Addons LIST *********************/

/* background matches addons.mozilla.org and the Get Addon-ons page */
.list {
  -moz-appearance: none;
  background: -moz-linear-gradient(top, rgb(204, 217, 234), white) ;
  margin: 0px;  border: none;
}

.addon {
  margin: 0px;
  border: 0px;
  border-bottom: 1px dotted rgba(0,0,0,.5);
  -moz-border-radius: 0px;
  background-color: transparent;
  color: black;
  padding: 2px;
}

/* disabled items */
.addon[status="uninstalled"],
.addon:not([active="true"]) {
  color: dimgrey;}

.addon[status="uninstalled"]:not([selected="true"]):not([pending]) button:not(:hover),
.addon:not([active="true"]):not([selected="true"]):not([pending]) button:not(:hover),
.addon[status="uninstalled"] .icon,
.addon:not([active="true"]) .icon {
opacity: 0.6; }

.addon[status="uninstalled"]:not([selected="true"]):not([pending]) .text-link:not(:hover),
.addon:not([active="true"]):not([selected="true"]):not([pending])  .text-link:not(:hover) {
  color: dimgrey;}
 
   
.addon:not([active="true"])[selected="true"] .icon {
opacity: 0.8; }


.addon[selected="true"][active="true"]:not([pending]) {
  background-image: url("chrome://mozapps/skin/extensions/itemEnabledFader.png");
  background-color: Highlight;
  color: HighlightText;
}
.addon[selected="true"][active="true"]:not([pending]) .text-link {
color: HighlightText; }

.addon[selected="true"]:not([active="true"]):not([pending]) {
  background-image: url("chrome://mozapps/skin/extensions/itemDisabledFader.png");
}

/* pending items*/
.addon[selected="true"][pending] {
  background-image: -moz-linear-gradient(top, InfoBackground, rgb(250,190,26))!important;
}

.addon:not([selected="true"])[pending] {
  background-color: InfoBackground !important;
  background-image: none !important;
}


/***************** addons icons ****************/

.addon .icon {
  margin: 7px 5px;
  width: 32px;
  height: 32px;
  list-style-image: url("chrome://mozapps/skin/xpinstall/xpinstallItemGeneric.png");}

.addon[type="theme"] .icon {
  list-style-image: url("chrome://mozapps/skin/extensions/themeGeneric.png");}

.addon[type="plugin"] .icon {
  list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric.png");}


/***************** addon name ************************/

.name-container { margin-bottom: 0px; }
.creator { margin-top: -2px; }

#addons-page .details-container,
#addons-page .category-name,
#addons-page .category-badge {
-moz-margin-start: 3px;
-moz-margin-end: 3px; }

.addon .name,
.addon .version
.addon .update-postfix { 
font-size: 115; }

/* name BOLD like in 3.x */
.addon .name { font-weight: bold; }

/* kill off weird spacing around author name */
.addon .creator > label { margin-left: 1px; margin-right: 1px; }

/* hide the "More" button.  I don't like it */
.addon .details { display: none; }

/* hide the (disabled) label since we already have "disabled" styling */
.addon .disabled-postfix { display: none; }

/* hide Release Notes.... which don't currently work anyway */
.addon .relnotes-container { display: none; }



/****************** control buttons *******************/

/* make control buttons vertical*/
.addon .control-container {
  -moz-box-align: center;
  -moz-box-pack: end;
  padding: 2px;
-moz-box-orient: vertical !important;
-moz-box-direction: reverse !important;
}

#addons-page button > .button-box { padding: 2px; }

/* remove weird extra space above control buttons */
.addon .icon-container + vbox hbox + hbox {
margin-top: -0.95em !important;}

.addon-control {
-moz-padding-start: 6px !important;
-moz-padding-end: 6px !important;
margin: 1px;
margin-bottom: 2px;}

/* hide unused buttons */
.addon-control[disabled="true"] { display: none; }

/* made Options button a slightly different style */
.addon-control[label="Options"] {
color: -moz-FieldText;
background-color: -moz-Field;
}

/* make button-links look like links instead of butons */
.button-link {
  -moz-appearance: none;
  background: none transparent;
  -moz-box-shadow: none; border: none;
  text-decoration: underline;
  color: -moz-nativehyperlinktext; cursor: pointer;
  min-width: 0; padding: 0; margin: 0 3px; }


/************ list item WARNINGS ***************/

.warning {
  color: rgb(220,60,60);
  -moz-box-align: start;}

.addon[selected] .warning-icon { opacity: 1;}

.addon .basicinfo-container { -moz-box-align: start;}

.addon .details-container {
  -moz-box-align: end;
  -moz-margin-start: 20px;}



/*************************** download progress ***************************/

/* I'm having problems getting this stuff to work, if anyone has ideas, let me know */

.download-progress {
  background-image: -moz-linear-gradient(#E1E1E1, #FEFEFE);
  border-radius: 10000px;
  border: 1px solid #555;
  width: 200px;
  min-height: 24px!important;
}

.download-progress .start-cap,
.download-progress[complete] .end-cap,
.download-progress .progress .progress-bar {
  -moz-appearance: none;
  background-image: -moz-linear-gradient(#84A9D9, #5183C0);
}

.download-progress .progress {
  background-color: transparent;
  min-height: 24px!important;
}

.download-progress .start-cap, .download-progress .end-cap {
  width: 12px;
  min-height: 24px!important;
}

.download-progress .start-cap:-moz-locale-dir(ltr),
.download-progress .end-cap:-moz-locale-dir(rtl) {
  border-radius: 10000px 0 0 10000px;
}

.download-progress .end-cap:-moz-locale-dir(ltr),
.download-progress .start-cap:-moz-locale-dir(rtl) {
  border-radius: 0 10000px 10000px 0;
}

.download-progress .progress {
  -moz-appearance: none;
  padding: 0px;
  margin: 0px;
  border: none;
  height: 22px !important;
}

.download-progress button {
  -moz-appearance: none;
  border: 0px;
  border-radius: 10000px;
  min-width: 16px;
  width: 16px;
  height: 16px;
  margin: 3px;
  padding: 0px;
}

.download-progress .status-container { -moz-box-align: center; }

.download-progress button > .button-box {
padding: 0px !important;
margin: 0px !important;
}

/* from download.css */

.download-progress button {
  list-style-image: url(chrome://mozapps/skin/downloads/downloadButtons.png);
}

.download-progress .cancel {
  -moz-image-region: rect(0px, 32px, 16px, 16px);}

.download-progress .cancel:hover {
  -moz-image-region: rect(16px, 32px, 32px, 16px);}
 
.download-progress .cancel:active {
  -moz-image-region: rect(32px, 32px, 48px, 16px);}

.download-progress .pause {
  -moz-image-region: rect(0px, 48px, 16px, 32px);}
 
.download-progress .pause:hover {
  -moz-image-region: rect(16px, 48px, 32px, 32px);}
 
.download-progress .pause:active {
  -moz-image-region: rect(32px, 48px, 48px, 32px);}
